@extends('admin.base.web', ['title' => '主页'])
@section('content')
    <style>
        .el-aside {
            min-height: 100vh;
            background-color: gray
        }
        .can{
            padding: 20px ;
        }
    </style>
    <div id="app">
        <el-container>
                <el-main>
                    <el-button type="primary" @click="ktHenDialog = true" icon="el-icon-plus">空投母鸡卡</el-button>
                    <el-button type="success" @click="addMoneyDialog = true" icon="el-icon-plus">余额充值</el-button>
                    {{-- 空投母鸡卡 --}}
                    <el-dialog title="空投母鸡卡" :visible.sync="ktHenDialog" width="60%">
                        <el-form :model="form" label-position="right" size="mini" label-width="180px">
                            <el-form-item label="空投对象">
                                <el-input v-model="form.consumer"></el-input>
                            </el-form-item>
                            <el-form-item label="绿卡1">
                                <el-input v-model="form.green_card_1" type="number"></el-input>
                            </el-form-item>
                            <el-form-item label="绿卡2">
                                <el-input v-model="form.green_card_2" type="number"></el-input>
                            </el-form-item>
                            <el-form-item label="绿卡3">
                                <el-input v-model="form.green_card_3" type="number"></el-input>
                            </el-form-item>
                            <el-form-item label="绿卡4">
                                <el-input v-model="form.green_card_4" type="number"></el-input>
                            </el-form-item>
                            <el-form-item label="绿卡5">
                                <el-input v-model="form.green_card_5" type="number"></el-input>
                            </el-form-item>
                            <el-form-item label="蓝卡1">
                                <el-input v-model="form.blue_card_1" type="number"></el-input>
                            </el-form-item>
                            <el-form-item label="蓝卡2">
                                <el-input v-model="form.blue_card_2" type="number"></el-input>
                            </el-form-item>
                            <el-form-item label="红卡1">
                                <el-input v-model="form.red_card_1" type="number"></el-input>
                            </el-form-item>
                            <el-form-item label="黑卡1">
                                <el-input v-model="form.black_card_1" type="number"></el-input>
                            </el-form-item>
                            {{--                        <el-form-item label="随机">--}}
                            {{--                            <el-input v-model="form.randomization"></el-input>--}}
                            {{--                        </el-form-item>--}}
                        </el-form>
                        <div slot="footer" class="dialog-footer">
                            <el-button @click="ktHenDialog = false">关闭</el-button>
                            <el-button @click="addClick('form')" type="success">确认</el-button>
                        </div>
                    </el-dialog>

                    {{-- 余额充值 --}}
                    <el-dialog title="余额充值" :visible.sync="addMoneyDialog" width="60%">
                        <el-form :model="form1" label-position="right" size="mini" label-width="180px">
                            <el-form-item label="充值邮箱号">
                                <el-input v-model="form1.mail"></el-input>
                            </el-form-item>
                            <el-form-item label="充值金额">
                                <el-input v-model="form1.count" type="number"></el-input>
                            </el-form-item>
                        </el-form>
                        <div slot="footer" class="dialog-footer">
                            <el-button @click="ktHenDialog = false">关闭</el-button>
                            <el-button @click="addMoneyClick('form1')" type="success">确认</el-button>
                        </div>
                    </el-dialog>
                    <hr>
                    {{--看板--}}
{{--                    <div class="block">--}}
{{--                        <el-date-picker--}}
{{--                                v-model="date"--}}
{{--                                type="date"--}}
{{--                                placeholder="选择日期">--}}
{{--                        </el-date-picker>--}}
{{--                        <el-button type="primary" @click="query" >查询</el-button>--}}

{{--                    </div>--}}
{{--                    <el-row :gutter="20" class="can">--}}
{{--                        <el-col :span="6">--}}
{{--                            <div>--}}
{{--                                <el-statistic--}}
{{--                                        group-separator=","--}}
{{--                                        :precision="2"--}}
{{--                                        :value="123"--}}
{{--                                        title="疯狂马场"--}}
{{--                                ></el-statistic>--}}
{{--                            </div>--}}
{{--                        </el-col>--}}
{{--                        <el-col :span="6">--}}
{{--                            <div>--}}
{{--                                <el-statistic--}}
{{--                                        group-separator=","--}}
{{--                                        :precision="2"--}}
{{--                                        :value="123"--}}
{{--                                        title="聚宝盆"--}}
{{--                                ></el-statistic>--}}
{{--                            </div>--}}
{{--                        </el-col>--}}
{{--                        <el-col :span="6">--}}
{{--                            <div>--}}
{{--                                <el-statistic--}}
{{--                                        group-separator=","--}}
{{--                                        :precision="2"--}}
{{--                                        :value="123"--}}
{{--                                        title="猫狗斗"--}}
{{--                                ></el-statistic>--}}
{{--                            </div>--}}
{{--                        </el-col>--}}
{{--                    </el-row>--}}


                </el-main>
        </el-container>

    </div>
@endsection
@section('script')
    <script>
        // 初始化 Vue 实例
        new Vue({
            el: '#app',
            data() {
                return {
                    ktHenDialog: false,
                    addMoneyDialog: false,
                    form: {
                        id: "",
                        issuer: "",
                        consumer: "",
                        green_card_1: "0",
                        green_card_2: "0",
                        green_card_3: "0",
                        green_card_4: "0",
                        green_card_5: "0",
                        blue_card_1: "0",
                        blue_card_2: "0",
                        gold_card_1: "0",
                        red_card_1: "0",
                        black_card_1: "0",
                    },
                    form1: {
                        mail: "",
                        count: "",
                    },
                    date:'',
                };
            },
            computed: {},
            watch: {},
            created() {
            },
            mounted() {
            },
            destroyed() {
            },
            methods: {
                //手动发卡
                addClick() {
                    axios.post("{{ route('admin.manual.cards.add') }}", this.form).then(res => {
                        console.log(res.data)
                        if (res.data.code == 2) {
                            this.$message({
                                message: '添加成功!',
                                type: 'success'
                            });
                            this.ktHenDialog = false

                        } else {
                            this.$message({
                                message: '添加失败',
                                type: 'warning'
                            });
                        }
                    })
                },
                //充值金额
                addMoneyClick() {
                    axios.post("{{ route('api.manual.addMoney') }}", this.form1).then(res => {
                        console.log(res.data)
                        if (res.data.code == 2) {
                            this.$message({
                                message: '添加成功!',
                                type: 'success'
                            });
                            this.addMoneyDialog = false

                        } else {
                            this.$message({
                                message: '添加失败',
                                type: 'warning'
                            });
                        }
                    })
                },
                query(){
                    axios.get("{{ route('api.admin.queryData') }}",{
                        params:{
                            "date":this.date
                        }
                    }).then(res => {
                        console.log(res.data)
                    })
                }
            },
        });
    </script>
@endsection